<template>
  <!-- 如果当前组件被使用的时候,绑定原生事件,需要有一个根元素,因为绑定给组件的时候都是绑定给组件内模板的最外层元素 -->
  <div>
    <h4>Child1:{{count}}</h4>
    <button @click="add">累加</button>
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";

export default defineComponent({
  name: "Child1",
});
</script>

<script setup lang="ts">
import PubSub from "pubsub-js"
import {ref} from "vue"
const count = ref(0)
//点击累加数据的时候发布
const add = () => {
  count.value+=1
  //发布数据
  PubSub.publish("count" , count.value)
}
</script>
